<template>
	<div v-loading="loading" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading"
		class="viewContainer">
		<table border="1" style="border-collapse: collapse; width: 100%">
			<caption v-if="viewData" style="font-size:18px;font-weight:600">
				环境监控状态
			</caption>
			<tr v-if="viewData">
				<th>SlotID</th>
				<th>电流温度(deg c)</th>
				<th>最低值(deg c)</th>
				<th>最高值(deg c)</th>
			</tr>
			<tr v-for="(item, index) of viewData" :key="index">
				<th v-for="(citem, cindex) of item" :key="cindex">{{ citem }}</th>
			</tr>
		</table>
	</div>
</template>

<script>
	import request from "@/utils/request";
	import {
		getJavaServerData
	} from "@/api/index.js";
	import bus from "common/bus.js";
	export default {
		data() {
			return {
				viewData: "",
				timerName: "MonitorInfoNetworkVersion",
				timerEventName: "timerMonitorInfoNetworkVersion",
				selectedMonID: "",
				loading: false,
			};
		},

		created() {
			bus.$emit("timerNewTodo", {
				name: this.timerName,
				eventName: this.timerEventName,
				interval: this.timerInterval,
				intervalNow: 0,
			});

			bus.$on(this.timerEventName, (msg) => {
				if (msg.isGetData) {
					this.getInfo();
				}
			});
		},
		mounted() {
			bus.$on("ItemMonitorServer", (msg) => {
				this.resetData();
				this.selectedMonID = msg;
				this.getInfo();
			});
		},
		methods: {
			getInfo() {
				getJavaServerData("/Sp/networkenvironment", {
						hid: this.selectedMonID.MONID,
					})
					.then((_) => {
						console.log(123,_)
						this.viewData = this.filterData(4, _);
					})
					.finally((_) => {
						this.loading = false;
					});
			},
			// getInfo() {
			// 	request.get("http://172.20.1.133:7474/Sp/networkenvironment?hid="+this.selectedMonID.MONID)
			// 		.then(res => {
			// 			console.log("12444",res)
			// 			this.viewData = this.filterData(4,res);
			// 		})
			// },
			filterData(startIndex, data) {
				let res = []
				for (let i = startIndex; i < data.length; i++) {
					if (data[i][0] == "" || data[i].split(" ").filter((res) => res).length === 1) {
						continue;
					}
					res.push(data[i].split(" ").filter((res) => res));
				}
				return res
			},
			resetData() {
				this.viewData = "";
			},
		},
		beforeDestroy() {
			// 页面关闭前，移除定时器任务
			bus.$emit("timerNewTodo", {
				name: this.timerName,
			});
		},
	};
</script>

<style lang="scss" scoped>
	.viewContainer {
		padding: 15px;
		//   background: #fff;
		//   border: 1px solid #ddd;
		//   border-radius: 5px;
		//   min-height: 300px;
		// // max-height: 70vh;
		// // width: 100%;
		// overflow-y: scroll;
	}

	.viewContainer::-webkit-scrollbar {
		width: 6px;
		height: 6px;
	}

	.viewContainer::-webkit-scrollbar-thumb {
		background-color: #e0e0e0;
		border-radius: 3px;
	}
</style>
